<%--
  Created by IntelliJ IDEA.
  User: liuxi
  Date: 2018/5/23
  Time: 17:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/statics/bootstrap/css/bootstrap.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/statics/table/bootstrap-table.min.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/statics/date/bootstrap-datetimepicker.min.css"/>
    <script type="text/javascript" src="${pageContext.request.contextPath}/statics/jquery-3.2.1.min.js"></script>
    <script type="text/javascript"
            src="${pageContext.request.contextPath}/statics/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript"
            src="${pageContext.request.contextPath}/statics/table/bootstrap-table.min.js"></script>
    <script type="text/javascript"
            src="${pageContext.request.contextPath}/statics/table/locale/bootstrap-table-zh-CN.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/statics/date/Moment.js"></script>
    <script type="text/javascript"
            src="${pageContext.request.contextPath}/statics/date/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/statics/table/rawgit-bootstrap-editable.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/statics/table/combodate.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/statics/table/bootstrap-table-editable.min.js"></script>
</head>
<body>
<div class="panel panel-default">
    <div class="panel-body">
        <form class="form-inline">
            <div class="form-group">
                姓名：<input id="pName" name="pName" type="text" class="form-control" placeholder="搜索内容">
            </div>
            性别:
            <select id="pSex" name="pSex" class="form-control">
                <option value="全部">全部</option>
                <option value="男">男</option>
                <option value="女">女</option>
            </select>
            <div class="input-group input-daterange">
                <input id="firstDate" type="text" class="form-control">
                <span class="input-group-addon">
                    <span class="glyphicon glyphicon-calendar"></span>
                </span>
                <div class="input-group-addon">到：</div>
                <input id="secondDate" type="text" class="form-control">
                <span class="input-group-addon">
                    <span class="glyphicon glyphicon-calendar"></span>
                </span>
            </div>
            <button onclick="search()" type="button" class="btn btn-default">查询</button>
        </form>
    </div>
</div>
<table id="table"></table>
<%--模态框--%>
<div id="myModal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">病例详情</h4>
            </div>
            <div class="modal-body">
                <p>病例编号：<span id="c_id"></span></p>
            </div>
            <div class="modal-body">
                <p>患者编号：<span id="p_id"></span></p>
            </div>
            <div class="modal-body">
                <p>就诊医生：<span id="n_name"></span></p>
            </div>
            <div class="modal-body">
                <p>就诊时间：<span id="c_visitTime"></span></p>
            </div>
            <div class="modal-body">
                <p>就诊项目：<span id="c_visitProjet"></span></p>
            </div>
            <div class="modal-body">
                <p>主诉：<span id="c_compld"></span></p>
            </div>
            <div class="modal-body">
                <p>诊断信息：<span id="c_DiagnosisInfo"></span></p>
            </div>
            <div class="modal-body">
                <p>是否需要复查：<span id="c_reviewIstrue"></span></p>
            </div>
            <div class="modal-body">
                <p>建议复查日期：<span id="c_reviewTime"></span></p>
            </div>
            <div class="modal-body">
                <p>建议：<span id="c_proposal"></span></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</body>
<script type="text/javascript">
    //得到查询的参数
    function queryParams(params) {
        var temp = {  //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
            pageSize: params.pageSize,  //页面大小
            pageNumber: params.pageNumber, //页码
            pName: $("#pName").val(),
            pSex: $("#pSex").val(),
            firstDate: $("#firstDate").val(),
            secondDate: $("#secondDate").val()
        };
        return temp;
    }
    function search() {
        var opts = $("#table").bootstrapTable('getOptions');
        var pName = $("#pName").val();
        var pSex = $("#pSex").val();
        var firstDate = $("#firstDate").val();
        var secondDate = $("#secondDate").val();
        $.ajax({
            "url": "${pageContext.request.contextPath}/Patient/query",
            "type": "post",
            "data": {
                "pName": pName,
                "pSex": pSex,
                "firstDate": firstDate,
                'secondDate': secondDate,
                "pageNumber": opts.pageNumber,
                "pageSize": opts.pageSize
            },
            "dataType": "json",
            "success": function (data) {
                $("#table").bootstrapTable('load', data);
            }
        })
    }

    $(function () {
        // 时间插件
        $('#firstDate').datetimepicker({
            //viewMode: 'day',
            format: 'YYYY-MM-DD'
        });
        $('#secondDate').datetimepicker({
            format: 'YYYY-MM-DD',
            useCurrent: false //Important! See issue #1075
        });
        $("#firstDate").on("dp.change", function (e) {
            $('#secondDate').data("DateTimePicker").minDate(e.date);
        });
        $("#secondDate").on("dp.change", function (e) {
            $('#firstDate').data("DateTimePicker").maxDate(e.date);
        });
        //bootstrapTable
        $("#table").bootstrapTable({
            url: '${pageContext.request.contextPath}/Patient/query',
            editable:true,
            columns: [{
                field: 'pid',
                title: '患者编号'
            }, {
                field: 'pname',
                title: '患者姓名',
                editable:{}
            }, {
                field: 'psex',
                title: '患者性别'
            }, {
                field: 'pcards',
                title: '患者身份证号'
            }, {
                field: 'pemal',
                title: '患者邮箱'
            }, {
                field: 'pBirthDate',
                title: '患者生日'
            }],
            detailView: true,
            onExpandRow: function (index, row, $detail) {
                var pid = row.pid;
                var p = $detail.html('<table></table>').find('table');
                $(p).bootstrapTable({
                    url: '${pageContext.request.contextPath}/case/getCaseById?pid=' + pid + '',
                    columns: [{
                        field: 'cid',
                        title: '病例编号'
                    }, {
                        field: 'cvisitProjet',
                        title: '就诊项目'
                    }, {
                        field: 'nName',
                        title: '就诊医生'
                    }],
                    onDblClickCell: function (field, $element, row) {
                        var cid = row.cid;
                        $.ajax({
                            "url": '${pageContext.request.contextPath}/case/getCase',
                            "type": "post",
                            "data": {"cid": cid},
                            "success": function (data) {
                                $('#myModal').modal('show');
                                $("#c_id").text(data.cid);
                                $("#p_id").text(data.pid);
                                $("#n_name").text(data.nName);
                                $("#c_visitTime").text(data.cVisitTime);
                                $("#c_visitProjet").text(data.cvisitProjet);
                                $("#c_compld").text(data.ccompld);
                                $("#c_DiagnosisInfo").text(data.cdiagnosisInfo);
                                if(data.creviewIstrue==0){
                                    $("#c_reviewIstrue").text("否");
                                    $("#c_reviewTime").text("不需要复查");
                                }else{
                                    $("#c_reviewIstrue").text("是");
                                    $("#c_reviewTime").text(data.cReviewTime);
                                }
                                $("#c_proposal").text(data.cproposal);
                            }
                        })
                    }
                });
            },
            method: 'post',
            contentType: "application/x-www-form-urlencoded",
            height: 500,
            pageList: [5, 10, 15],
            pageSize: 5,
            pageNumber: 1,
            pagination: true,
            queryParamsType: '',
            queryParams: queryParams,
            sidePagination: 'server'
        });
    });
</script>
</html>
